import React from 'react';

import { setDocumentTitle } from  '../../components/utils';

import DatePicker from '../../../../components/date/Date.jsx';

/* 测试数据
* 日期区间测试：date='2018-09-28' minDate='2017-08-30' maxDate='2018-10-10'
* */

export default class DatePage extends React.Component {
  constructor(props){
    super(props);
    this.changeCallback = this.changeCallback.bind(this);
    setDocumentTitle('Date');

  }

  // DatePicker change 后执行
  changeCallback(date, dateObj){
  }
  render(){
    let props = {
      range: true,
      date: '2018-09-28',
      minDate: '2018-08-30',
      maxDate: '2018-10-10',
      startDate: '2018-08-30',
      endDate: '2018-10-03',
      // hasTimePicker: true,
      // format: 'YYYY-MM-DD HH:mm:ss',
      changeCallback: this.changeCallback
    }
    return <div className='date-page' >
      <div className='date-example'>
        <h2>最基本样式</h2>
        <DatePicker />
      </div>
      <div className='date-example  '>
        <h2>日期加时间</h2>
        <DatePicker {...props} hasTimePicker={true} range={false} date={'2018-10-09 16:51:53'} />
      </div>
      <div className='date-example-range'>
        <h2>时间区间选择</h2>
        <DatePicker {...props} />
      </div>
    </div>
  }
}